<template >
    <div>
        <div>{{msg}}</div>
        <!-- //动态改变数据 -->
        <SchoolN :GetStudent="GetStudent"></SchoolN>
        //通过父组件给子组件绑定事件(用v-on:或者@)
        <StudentN v-on:demo="demo" @test="test"></StudentN>
        //通过ref绑定事件
        <!-- <StudentN ref="student"></StudentN> -->
    </div>
</template>
<script>
    import StudentN from './compoents/StudentN'
    import SchoolN from './compoents/SchoolN';
    export default {
        name: 'App',
        components: {
            StudentN,
            SchoolN
        },
        data() {
            return {
                msg: '你'
            }
        },
        methods: {
            GetStudent(value) {
                return console.log(value);
            }, demo(name, ...a) {
                console.log('demo被调用了', name, a);
                this.msg = name
                //不可在mounted中调用,因为实例对象为子组件的vc实例
            }, test() {
                alert('已经绑定事件了');
            }
        },
        mounted() {
            // setTimeout(() => {
            //     this.$refs.student.$on('demo', this.demo)
            // }, 3000);
            //ref可更好的自定义事件
            // this.$refs.student.$once('demo', this.demo)

        },
    }
</script>
<style>
</style>